{% extends 'base.html' %}

{% block content %}
<style>
  .avatar {
    width:100px;
    height: 100px;
    border:1px solid #ddd;
    padding:5px;
    margin-bottom: 5px;
  }
</style>
<div class="pagetitle">
  <ul class="breadcrumb">
    <li class="breadcrumb-item">个人信息</li>
    <li class="breadcrumb-item active">修改信息</li>
  </ul>
</div>
<section class="section dashboard">
  <div class="row">
    <div class="col-lg-12">

      <div class="card">
        <div class="card-body">
       

          <div class="activity">

            <form action="/app/changeUserInfo/" method="POST" enctype="multipart/form-data">
              <div class="row mb-3">
                <label for="inputText" class="col-sm-2 col-form-label">用户名</label>
                <div class="col-sm-10">
                  <input type="text" name="username" disabled value="{{ user.username }}" class="form-control">
                </div>
              </div>
              <div class="row mb-3">
                <label for="inputText" class="col-sm-2 col-form-label">地址</label>
                <div class="col-sm-10">
                  <input type="text" name="address" value="{{ user.address }}" class="form-control">
                </div>
              </div>
              <div class="row mb-3">
                <label for="inputText" class="col-sm-2 col-form-label">性别</label>
                <div class="col-sm-10">
                  <select class="form-select" name="sex" aria-label="Default select example">
                   <option {% if user.sex == '男' %} selected {% endif %} value="男">男</option>
                   <option {% if user.sex == '女' %} selected {% endif %} value="女">女</option>
                  </select>
                </div>
              </div>
              <div class="row mb-3">
                <label for="inputText" class="col-sm-2 col-form-label">个人简介</label>
                <div class="col-sm-10">
                  <textarea name="textarea" class="form-control" placeholder="{{ user.textarea }}" value="{{ user.textarea }}" style="height: 100px;"></textarea>
                </div>
              </div>
              <div class="row mb-3">
                <label for="inputText" class="col-sm-2 col-form-label">头像上传</label>
                <div class="col-sm-10">
                  <img class="avatar" src="{{ user.avatar.url }}" alt="">
                  <br>
                  <input type="file" name="avatar">
                </div>
              </div>
              <div class="row mb-3">
                <label for="inputText" class="col-sm-2 col-form-label"></label>
                <div class="col-sm-10">
                  <button type="submit" class="btn btn-primary">提交</button>
                </div>
              </div>
            </form>

          </div>

        </div>
      </div>

    </div>

  </div>
</section>
{% endblock %}

{% block js %}
<script>

</script>
{% endblock %}